﻿<%@ Control Language="C#" ClassName="ThemePicker" %>
<%@ Import Namespace="System" %>
<%@ Import Namespace="System.IO" %>
<%@ Import Namespace="System.Web" %>
<%@ Import Namespace="System.Web.UI" %>
<%@ Import Namespace="System.Web.UI.WebControls" %>

<script runat="server">
    
    protected override void OnPreRender(EventArgs e)
    {
        Page.ClientScript.RegisterHiddenField("selectedTheme", Page.Theme);
        base.OnPreRender(e);
    }

    protected void Page_Load(object sender, EventArgs e)
    {

        string[] dirs = Directory.GetDirectories(Context.Server.MapPath("~/app_themes/"));
        foreach (string dir in dirs)
        {
            DirectoryInfo di = new DirectoryInfo(dir);
            SimpleListItem item = new SimpleListItem();
            if (Page.Theme == di.Name)
                item.CssClass += "ui-state-active ui-corner-all";
            item.Text = di.Name;
            item.ImageUrl = "~/Images/ThemeIcons/theme_30_" + di.Name + ".png";
            ThemeListView.Items.Add(item);
        }


        ThemeListView.DataBind();
        lbTheme.Text = "Theme:" + Page.Theme;
    }
</script>

<style type="text/css">
    .dna-ui-dropdown { position: absolute; left: 0px; right: 0px; top: 25px; overflow: auto; height: 250px; padding-top: 5px; padding-bottom:5px;z-index: 2000; }
    .dna-ui-dropdown li { margin: 5px; position: relative; padding-left: 10px; padding-top: 5px; }
    .dna-ui-dropdown li a { display: block; height: 30px; }
    .dna-ui-dropdown li a span { float: left; margin: 3px; position: absolute; top: 7px; }
</style>
<div class="ui-state-default ui-corner-all themeselector" style="position: relative;
    width: 160px; height: 25px;">
    <asp:Label ID="lbTheme" runat="server" Text="" Style="width: 150px; padding-left: 5px;
        position: absolute; padding-top: 5px;"></asp:Label>
    <span class="ui-icon ui-icon-triangle-1-s" style="margin: 5px 5px 5px; float: right;
        right: 0pt; position: absolute; top: 0px;"></span>
    <DotNetAge:SimpleListView ID="ThemeListView" runat="server" CssClass="ui-helper-reset ui-helper-hidden ui-widget-content dna-ui-dropdown"
        ItemCssClass="ui-widget-content ui-corner-all">
        <ItemTemplate>
            <a href="#" title='<%# Eval("Text") %>'>
                <asp:Image ID="Image1" runat="server" ToolTip='<%# Eval("Text") %>' ImageUrl='<%# Eval("ImageUrl") %>' />
                <asp:Label ID="Label1" runat="server" Text='<%# Eval("Text") %>'></asp:Label>
            </a>
        </ItemTemplate>
    </DotNetAge:SimpleListView>
</div>

<script type="text/javascript">
    $(function() {
        $(".themeselector").hover(function() {
            $(this).addClass("ui-state-highlight");
        }, function() {
            $(this).removeClass("ui-state-highlight");
        });

        $(".themeselector").click(function() {
            $(this).toggleClass("ui-state-highlight");
            $(this).toggleClass("ui-state-active");
            $(this).toggleClass("ui-corner-all");
            $(this).toggleClass("ui-corner-top");
            $(".dna-ui-dropdown").slideToggle("fast");
        });

        $(".dna-ui-dropdown>li").hover(function() {
            $(this).addClass("ui-state-hover");
        }, function() {
            $(this).removeClass("ui-state-hover");
        });

        $(".dna-ui-dropdown>li").click(function() {
            $("#selectedTheme").val($(this).find("span").html());
            document.forms[0].submit();
        });
    });
</script>

